<template>
	<view class="search flex m-t40">
		<image class="square-48" src="@/static/images/public/search.png"></image>
		<input
			class="flex-1 m-l10"
			type="text"
			placeholder="请输入关键词/职位"
			v-model="value"
		/>
		<div class="searchBtn" @click="emit('search', value)">搜索</div>
	</view>
</template>

<script lang="ts" setup>
import { computed, ref } from "vue";
const props = defineProps({
	customPlaceholder: {
		type: String,
		default: "搜索",
	},
});
const emit = defineEmits(["update:modelValue", "change"]);
const value = ref("");
</script>

<style lang="scss" scoped>
.search {
	height: 74rpx;
	border-radius: 20rpx;
	background: $bg-color-1;
	border: 2rpx solid #3f77fb;
	// overflow: hidden;
	.searchBtn {
		width: 150rpx;
		line-height: 74rpx;
		height: 100%;
		border-radius: 10rpx;
		color: #fff;
		background-color: #3c9cff;
		text-align: center;
		font-size: 26rpx;
	}
}
</style>
